<extend name="default/template/mybase2" />

<block name="head">
  <link rel="stylesheet" href="__CSS__/SGoods.css?v=20160504" />
</block>

<block name="body">
  <div class="page-group">
  <div id="page-infinite" class="page">
    <div class="content infinite-scroll" id="page-infinite" data-distance="100">
	    <div class="card headerCard">
			 <div class="card-footer">
			  <div class="left">
			  	我的积分：<span class="yel">{$score}</span><br>
					<a class="notag" href="{:U('Index/gainScore',array('uid'=>$uid,'psw'=>$psw))}">如何获取更多积分？</a>
          <!-- {:U('Index/gainScore',array('uid'=>$uid,'psw'=>$psw))} -->
			  </div>
			  <a class="right text-r notag" data-no-cache="true"  href="{:U('ExchangeLog/index',array('uid'=>$uid,'psw'=>$psw))}">积分兑换记录</a>
        <!-- {:U('ExchangeLog/index',array('uid'=>$uid,'psw'=>$psw))} -->
				</div>
			</div>
      <!-- <div class="card lotCard"><a href="{:U('Game/index',array('uid'=>$uid,'psw'=>$psw))}"><div class="card-header"><span>立刻抽奖 </span></div></a></div> -->
			<div class="card conCard">
				<div class="card-header"><div class="deco">&nbsp;</div><div class="left">积分兑换</div></div>
				<div class="card-content">
		    	<div class="list-block">
          	<ul class="list-container clearfix">
          	</ul>
      		</div>
		    </div>
			</div>
       <!-- 加载提示符 -->
      <div class="infinite-scroll-preloader" id="bar"><div class="preloader"></div></div>
    </div>
  </div>
</div>
</block>

<block name="foot">
  <script>
  $(function() {
    'use strict';
    // alert('alert');
    // $.alert('这是一段提示消息');
  $(document).on("pageInit", "#page-infinite", function(e, id, page) {
      var loading = false;
    // 最多可加载的条目
      var maxItems = 500;
      var itemsPerLoad = 5;
      var lastIndex = $('.list-container li').length;
    // console.log('---'+lastIndex);
      addItems(itemsPerLoad, lastIndex);
    function addItems(number, lastIndex) {
       $.getJSON("{:U('ScoreGoods/getSGoods',array('uid'=>$uid,'psw'=>$psw),false)}",{ 'start':lastIndex,'size':number },function(data){
          // console.log('data',data);
          if(!data.status){$.alert('服务器故障');return;}
          if(!data.info || data.info.length < number){
            $.toast('没有更多了');$('.infinite-scroll-preloader').remove();
            // console.log('没有了');
            $.detachInfiniteScroll($('.infinite-scroll'));
            // return;
          }
          var html = '',info =data.info;
          // console.log('length:'+data.info.length);
          $.each(info,function(i,v){
            // html += '<li class="item-content"><div class="item-inner"><div class="item-title">Item ' + i + '</div></div></li>';
            html +='<li>'
                +'<a class="img notag" href="{:U(\'Webview/ScoreGoods/detail\',array(\'uid\'=>$uid,\'psw\'=>$psw),'')}/id/'+v.id+'"><img src="{:U(\'Api/Picture/index\')}?id='+v.main_img+'" alt=""></a>'
                +'<a href="{:U(\'Webview/ScoreGoods/detail\',array(\'uid\'=>$uid,\'psw\'=>$psw),'')}/id/'+v.id+'" class="notag"><div class="th">'+v.name+'</div></a>'
                +'<div class="score">'+v.score+'积分'
                +(v.price>0 ? '+'+v.price+'元':'')
                +'</div>'
                +'</li>';
              // console.log(p);
          });
          // 添加新条目
          $('.infinite-scroll .list-container').append(html);
          // $.detachInfiniteScroll($('.infinite-scroll'));
            // 删除加载提示符
          $('.infinite-scroll-preloader').remove();
          $.refreshScroller();
      })

    }
   // 注册'infinite'事件处理函数
    $(page).on('infinite', function() {
      console.log('infinate');
      if (loading) return;
      loading = true;
      setTimeout(function() {
          loading = false;
          // if (lastIndex >= maxItems) {
          //     $.detachInfiniteScroll($('.infinite-scroll'));
          //     $('.infinite-scroll-preloader').remove();
          //     return;
          // }
          lastIndex = $('.list-container li').length;
          addItems(itemsPerLoad, lastIndex);
          $.refreshScroller();
      }, 1000);
    });
  });
     $.init();
  });
  </script>
</block>